<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=noe">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
    <link rel="stylesheet" href="../css/iconfont.css">
    <link rel="stylesheet" href="../css/invite.css">
</head>
<body>
    <div id="app">
        <div class='input-div'>
            <p>输入推荐人ID号</p>
            <form action="javascript:;" id="myform" @submit="onSubmit">
                <input type="type" class='telephone' v-model='referrerID'>
                <i @click='clearPhone' v-show="referrerID" class='iconfont icon-chacha'></i>
            </form>
        </div>
        <!--没有输入手机号时-->
        <div class='no_phone-div' v-show='showScan'> 
            <p class='scan-div'>
                <span @click='onSubmit'>立即绑定</span>
            </p>
            <p>
                没有邀请人？
                <span class='contact'>点此联系客服</span>
            </p>
        </div>

        <!--有输入手机号时-->
        <div class='has_phone-div' v-show='!showScan' v-cloak>
            <img :src="avatar" alt="">
            <p class='nickname'>{{nickname}}</p>
            <!--我的推荐人-->
            <p class='my_tuijian'>确认时，是我的推荐人</p>
            <p class='not_tuijian' @click='showBindBtn'>不是我的推荐人</p>
        </div>

        
    </div>
    <!--底部提示语-->
    <p class='bottom-tip'>伯乐，只给你最需要的</p>


<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<script src='../js/invite.js'></script>
</body>
</html>